<template>
  <div>
    <span class="text-smaller">消息标题</span>
    <el-input placeholder="消息标题" v-model="title" size="small"></el-input>
    <span class="text-smaller">消息模版</span>
    <el-input type="textarea" placeholder="消息模版" v-model="content"></el-input>
  </div>
</template>

<script>
export default {
    name: "InfoPanel"
    , props: {
        // 作业ID
        guid: {type: String, default: undefined}
    }, data(){
        return {
            // 标题
            title: '验证码'
            // 模版
            , content: '尊敬的${username}，您的验证码为：${code}，如果你未办理相关业务，请忽略当前短信。'
        }
    }, watch: {
        guid: {
            handler: function (val) {
                this.reload(val);
            }
        }
    }, methods: {
        /**
         * 重新加载数据
         *
         * @param id 查询参数
         */
        reload: function (id) {
            this.$layers.ajax({
                url: '/sys/msg/info',
                method: 'GET',
                params: {id: id}
            }).then((result) => {
                if (result.code === 0) {
                    let data = result.data;
                    this.title = data.title;
                    this.content = data.content;
                }
            });
        }
    }
}
</script>

<style scoped>
</style>